<template>
	<view class="btn" @click="clickBtn(e)" :style="btnStyle">
		<slot></slot>
	</view>
</template>

<script setup>
	import {ref} from 'vue'
	const props = defineProps(['w','h','r','bc','fc'],)
	const emit = defineEmits({ handleClick:(e)=>{
		
	}})
	const theme = {
		width:'90%',
		height:'60rpx',
		borderRadius:'30rpx',
		background:'#fff',
		color:'#000',
	}
	theme.width = props.w||theme.width
	theme.height = props.h||theme.height
	theme.borderRadius = props.r||theme.borderRadius
	theme.background = props.bc||theme.background
	theme.color = props.fc||theme.color
	const btnStyle = ref(theme)
	function clickBtn(e){
		emit('handleClick',1)
	}
</script>

<style lang="scss">
	.btn{
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>